<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <title layout:title-pattern="$CONTENT_TITLE | $LAYOUT_TITLE" th:text="${applicationTitle}">Warehouse Management System</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport" />
  <link th:href="@{|${theme}/css/bootstrap.min.css|}" href="/themes/inspinia/css/bootstrap.min.css" rel="stylesheet" />
  <link th:href="@{|${theme}/font-awesome/css/font-awesome.min.css|}" href="/themes/inspinia/font-awesome/css/font-awesome.min.css"
        rel="stylesheet" />
  <link th:href="@{|${theme}/css/animate.min.css|}" href="/themes/inspinia/css/animate.min.css" rel="stylesheet" />
  <link th:href="@{|${theme}/css/style.min.css|}" href="/themes/inspinia/css/style.min.css" rel="stylesheet" />

  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->

</head>

<body>
<div class="gray-bg" style="height: 100%;display: flex; justify-content: center;">
  <div class="box middle-box text-center loginscreen animated fadeInDown">
    <div class="box-body" style="width: 600px; height: 350px; margin-top: 50px; margin-left: -150px;">
      <div>
        <h1 style="font-size: 50px;" class="logo-name" th:text="${applicationTitle}">WMS</h1>
      </div>
      <h3> Ver: [[${applicationVersion}]]</h3>
      <hr/>
      <p class="alert alert-danger" th:if="${#session!=null and #session.getAttribute('SPRING_SECURITY_LAST_EXCEPTION')!=null}">
        [[${#session.getAttribute('SPRING_SECURITY_LAST_EXCEPTION')!=null?#session.getAttribute('SPRING_SECURITY_LAST_EXCEPTION').localizedMessage:'登录失败，请稍后重试!'}]]</p>
      <form class="m-t form-vertical" role="form" th:action="@{/login}" action="/login" method="post">
        <div class="form-group">
          <input type="text" id="username" name="username" class="form-control" placeholder="请输入登录用户名" required="true" />
        </div>
        <div class="form-group">
          <input type="password" id="password" name="password" class="form-control" placeholder="请输入登录用密码" required="true" />
        </div>
        <button type="submit" class="btn btn-primary btn-lg block full-width m-b">登录</button>
      </form>

      <!-- 系统提示文本（动态内容） -->
      <p id="maintenanceTip" class="text-danger" style="display: none; margin-top: 15px; font-weight: bold;">
        <i class="fa fa-exclamation-triangle"></i>
        <span id="tipPrefix">立库系统将于 </span>
        <span id="countdown" style="color: #d9534f; font-weight: bold;"></span>
        <span id="tipSuffix"> 后停止使用，按甲方要求整改完后恢复，请提前做好准备！</span>
      </p>

      <hr/>
      <p class="m-t">
        <small th:utext="${copyright}"></small>
      </p>
    </div>
  </div>
</div>
<!-- Mainly scripts -->
<script th:src="@{|${theme}/js/jquery-2.1.1.js|}" src="/themes/inspinia/js/jquery-2.1.1.js"></script>
<script th:src="@{|${theme}/js/bootstrap.min.js|}" src="/themes/inspinia/js/bootstrap.min.js"></script>
<script>
  $(function () {
    // 合并重复的sessionStorage.clear()调用
    sessionStorage.clear();

    // 定义维护时间节点
    const maintenanceStart = new Date('2025-09-23T23:59:59'); // 维护开始时间
    const maintenanceEnd = new Date('2025-09-24T23:59:59');   // 维护结束时间
    const now = new Date(); // 当前系统时间
    const tipElement = $('#maintenanceTip');
    const countdownElement = $('#countdown');
    const tipPrefix = $('#tipPrefix');
    const tipSuffix = $('#tipSuffix');
    let countdownInterval;

    // 判断当前时间并设置提示内容
    if (now < maintenanceStart) {
      // 维护前：显示提示文本并启动倒计时
      tipElement.show();
      startCountdown();
    } else if (now >= maintenanceStart && now <= maintenanceEnd) {
      // 维护中：显示“系统维护中”
      tipPrefix.hide();
      tipSuffix.hide();
      countdownElement.text('系统维护中，暂时无法登录！');
      tipElement.show();
    } else {
      // 维护后：隐藏提示
      tipElement.hide();
    }

    // 启动倒计时
    function startCountdown() {
      // 清除可能存在的计时器
      if (countdownInterval) {
        clearInterval(countdownInterval);
      }

      // 更新倒计时
      function updateCountdown() {
        const now = new Date();
        const timeLeft = maintenanceStart - now;

        // 如果已到维护时间
        if (timeLeft <= 0) {
          clearInterval(countdownInterval);
          tipPrefix.hide();
          tipSuffix.hide();
          countdownElement.text('系统维护中，暂时无法登录！');
          return;
        }

        // 计算剩余时间
        const days = Math.floor(timeLeft / (1000 * 60 * 60 * 24));
        const hours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        const minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60));
        const seconds = Math.floor((timeLeft % (1000 * 60)) / 1000);

        // 格式化倒计时显示
        let timeString = '';
        if (days > 0) {
          timeString += `${days}天`;
        }
        timeString += `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;

        // 更新倒计时显示
        countdownElement.text(timeString);
      }

      // 立即更新一次
      updateCountdown();
      // 每秒更新一次
      countdownInterval = setInterval(updateCountdown, 1000);
    }
  });
</script>
</body>

</html>
